<template>
  <div class="forget-pass">
    <div class="close" @click="close()">
      <img src="../../../assets/image/user/close-ico.png" alt="" />
    </div>
    <h2 class="title">找回密码</h2>
    <div class="username inp">
      <input type="text" placeholder="手机号" />
    </div>
    <div>
      <el-row class="verif">
        <el-col :span="12" class="inp">
          <input type="text" placeholder="验证码" />
        </el-col>
        <el-col :span="7" class="img">
          <img src="../../../assets/image/user/verif.jpg" alt="" />
        </el-col>
        <span class="primary-color">换一张</span>
      </el-row>
    </div>
    <div class="verif-code inp">
      <input type="text" placeholder="短信验证码" />
      <div class="primary-color get-code">获取验证码</div>
    </div>
    <div class="btn">
      下一步
    </div>
  </div>
</template>

<script>
export default {
  methods: {
    close() {
      let data = {
        userVivew: false,
        showVivew: '',
      }
      this.$store.commit('SET_VIEW', data)
    },
  },
}
</script>

<style lang="less" scoped>
@import '../common/index.less';
.verif {
  display: flex;
  align-items: center;
  margin-bottom: 20px;
  .img {
    margin: 0 10px;
    padding-top: 10px;
    img {
      width: 100%;
    }
  }

  .inp {
    margin-bottom: 0;
  }
}
</style>
